import React, { useEffect, useRef } from 'react';
import './index.scss'
import * as echarts from 'echarts';
const BarChart = ({ title, listX, listY}) => {
    const myRef = useRef(null) // 1、拿到dome元素
    useEffect(() => {
     const myChart = echarts.init(myRef.current)  // 2、初始化mychart实例;
      // 3、渲染图表
     myChart.setOption({
        title: {
            text: title
          },
          tooltip: {},
          xAxis: {
            data: listX
          },
          yAxis: {},
          series: [{ name: 'GDP总量', type: 'bar', data: listY, barWidth: '45%'}]
     },
    )
   }, [])
    return (
        <div>
            <div className="box" ref={myRef}></div>
        </div>
    );
};

export default BarChart;